<template>
  <div id="app">
    <img src="./assets/logo.svg"/>

    <br/><br/>

    <div>
      <router-link to="/home">首页</router-link>
      |
      <router-link to="/about">关于</router-link>
      |
      <router-link to="/useMouse">useMouse</router-link>
      |
      <router-link to="/useCount">useCount</router-link>
      |
      <router-link to="/useMouseInElement">useMouseInElement</router-link>
      |
      <router-link to="/IntersectionObserver">IntersectionObserver</router-link>
      |
      <router-link to="/onClickOutside">onClickOutside</router-link>
|
      <router-link to="/useRefHistory">useRefHistory</router-link>
|
      <router-link to="/useTransition">useTransition</router-link>
|
      <router-link to="/useVModel">useVModel</router-link>
|
      <router-link to="/useVModelChild">useVModelChild</router-link>

    </div>
    <router-view></router-view>
  </div>
</template>

<script>

export default {}
</script>

<style scoped>
html, body, h1, h2, h3, p {
  font-family: 'Noto Serif', serif;
  user-select: none;
}

#app {
  text-align: center;
  color: rgba(0, 0, 0, 0.4);
}

img {
  width: 500px;
}

a {
  color: #41b883;
  text-decoration: none;
  cursor: pointer;
}
</style>
